import { resolveComponent } from 'vue'
import { fliterDataWrapper } from 'common/js/table'
import { townList } from 'common/js/modules'

const townArr = townList()
export const columns = (that) => {

  return [
    {
      key: 'stcd',
      align: 'center',
      width: 120,
      title: '水库编码',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'stcd')
      }
    },
    {
      key: 'stnm',
      align: 'center',
      title: '水库名称',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'stnm')
      }
    },
    {
      key: 'area',
      title: '所属区域',
      align: 'center',
      render: (h, params) => {
        const { row } = params

        const zhenName = townArr.find(item => item.value === row.zhenCode) || {}

        return h('div', {}, [
          h('div', { }, row['addvcdName']),
          h('div', { }, zhenName.label)
        ])
      }
    },
    {
      key: 'area',
      title: '所属区域编码',
      align: 'center',
      render: (h, params) => {
        const { row } = params

        return h('div', {}, [
          h('div', { }, row['addvcd']),
          h('div', { }, row['zhenCode'])
        ])
      }
    },
    {
      key: 'rz',
      title: '水位',
      width: 150,
      align: 'center',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'rz')
      }
    },
    {
      key: 'tm',
      align: 'center',
      title: '监测时间',
      render: (h, params) => {
        const { row } = params

        return fliterDataWrapper(h, row, 'tm')
      }
    },
    {
      key: 'status',
      align: 'center',
      title: '状态',
      render: (h, params) => {
        const { row } = params
        const status = row.status
        let color = '#19be6b' // 默认绿色

        // 根据状态设置不同颜色
        if (status === '延迟2小时') {
          color = '#ff9900'
        } else if (status === '延迟3小时') {
          color = '#ff7700'
        } else if (status === '延迟12小时') {
          color = '#ff5500'
        } else if (status === '延迟1天') {
          color = '#ff3300'
        } else if (status === '延迟3天') {
          color = '#ff1100'
        } else if (status === '延迟7天以上' || status === '数据缺失') {
          color = '#ed4014'
        }

        return h('span', { style: { color } }, row.status || '--')
      }
    },
    {
      key: 'action',
      title: '操作',
      width: 70,
      align: 'center',
      render: (h, params) => {
        const { row } = params
        
        const list = [
          { text: '详情', type: 'primary', clickFn: () => { that.resetPsd(row) } }
        ]

        return h(resolveComponent('TableButton'), {
          list
        })
      }
    }
  ]
}
